import prompt from '@system.prompt';

export default {
    data: {
        themeColor:"#1E90FF",
        playState: "running"
    },
    onShow() {
        this.animation1()
    },
    animation1() {
        let options = {
            duration: 3000,
            iterations: "Infinity"
        }
        let frames = [
            {
                offset: 0.1,
                opacity: 0.1,
                backgroundColor: "#7CFC00",
                transform: {
                    translate: "10px",
                    rotate: "0deg",
                    scale: "1.0",
                }
            },
            {
                offset: 0.4,
                opacity: 0.4,
                backgroundColor: "#00FF00",
                transform: {
                    translate: "150px",
                    rotate: "60deg",
                    scale: "1.5",
                }
            },
            {
                offset: 0.7,
                opacity: 0.7,
                backgroundColor: "#20B2AA",
                transform: {
                    translate: "220px",
                    rotate: "120deg",
                    scale: "3.0",
                }
            },
            {
                offset: 1,
                opacity: 1,
                backgroundColor: "#006400",
                transform: {
                    translate: "300px",
                    rotate: "180deg",
                    scale: "1.5",
                }
            }
        ]
        let animation = this.$refs.animation1.animate(frames, options)
        animation.play()
    },
    animation2() {
        let options = {
            duration: 2000,
        }
        let frames = [
            {
                transform: {
                    translate: "-150px",
                }
            },
            {
                transform: {
                    translate: "150px",
                }
            },

        ]
        let animation = this.$refs.animation2.animate(frames, options)
        animation.onfinish = function () {
            prompt.showToast({
                message: "animation finish"
            })
        }
        animation.onstart = function () {
            prompt.showToast({
                message: "animation start"
            })
        }
        animation.play()
    }
}